<template>
	<view class="content">
		<view class="addimg" @click="avatarImg">
			<!-- <image src="../../static/images/addimg.png" mode=""></image> -->
			<block v-if="uploadTp">
				<image :src="avatar" mode="aspectFill"></image>
			</block>
			<block v-else>
				<image src="../../static/images/addimg.png"></image>
			</block>
		</view>
		<view class="addMessage_item flex_layout">
			<view class="left_name">名称</view>
			<view class="right_input"><input v-model="name" type="text" placeholder="请输入门店名称" placeholder-style="color: #999" value="" /></view>
		</view>

		
		<view class="addMessage_item flex_layout">
			<view class="left_name">电话</view>
			<view class="right_input"><input v-model="phonetext" type="number" placeholder="请输入门店电话" placeholder-style="color: #999" value="" /></view>
		</view>
		<view class="add_btn" @click="newAppointment">
			<button type="default">提交修改</button>
		</view>
		
	</view>
</template>

<script>
	const { dateTimePicker} = require('../../common/dateTimePicker.js');
	export default {
		data() {
			return {
				uploadTp:false,
				id:'',
				avatar:'',
				phonetext:'',
				name:'',
				addresstext:'请选择地址',
				longitude:'',
				latitude:'',
				province:'',
				city:'',
				area:'',
			}
		},
		onLoad(option) {
			this.id=option.clinic_id
			this.content();
		},
		methods: {
			mapImg: function(){
				var that=this;
				uni.chooseLocation({
				    success: function (res) {
							let data = {};
							data.location = res.latitude+','+res.longitude;
							data.key="KGMBZ-3YBLD-M7F4F-PAOZ6-DVBC2-UNBFL";
							uni.request({
								url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=',
								method: 'GET',
								data: data,
								success(res) {
									//详细地址
									that.addresstext=res.data.result.address
									//经度
									that.longitude=res.data.result.ad_info.location.lng
									//维度
									that.latitude=res.data.result.ad_info.location.lat
									//省
									that.province=res.data.result.ad_info.province
									//市
									that.city=res.data.result.ad_info.city
									//区
									that.area=res.data.result.ad_info.district
								}
							})
				    }
				});
			},
			
			content: function(){
				var that=this;
				that.$api.getCouponProfile(
					{
					id:that.id
					},
					res => {
						if(res.code==1){
							if(res.data.logoavatar){
								this.uploadTp=true
							}
							that.avatar=res.data.logoavatar
							that.addresstext=res.data.addresstext
							that.longitude=res.data.longitudetext
							that.latitude=res.data.latitudetext
							that.province=res.data.province
							that.city=res.data.city
							that.area=res.data.area
							that.name=res.data.name
							that.phonetext=res.data.phonetext
						}
						if(res.code==0){
							uni.showToast({
								title: res.msg,
								icon: "none",
								duration: 2000
							})
						}
						
					}
				)
			},
			
			newAppointment(){
				var that=this;
				if(that.avatar==''){
					uni.showToast({
						title: '请选择头像',
						icon: 'none',
						duration: 2000,
					})
					return false; 
				}
				if(that.name==''){
					uni.showToast({
						title: '请填写门店姓名',
						icon: 'none',
						duration: 2000,
					})
					return false; 
				}
				
				if(that.phonetext==''){
					uni.showToast({
						title: '请填写门店电话',
						icon: 'none',
						duration: 2000,
					})
					return false; 
				}
				
				that.$common.loadToShow()
				var data=[];
				data['id']=that.id
				data['logoavatar']=that.avatar
				data['addresstext']=that.addresstext
				data['longitude']=that.longitude
				data['latitude']=that.latitude
				data['province']=that.province
				data['city']=that.city
				data['area']=that.area
				data['name']=that.name
				data['phonetext']=that.phonetext
				that.$api.couponProfile(
					data,
					res => {
						that.$common.loadToHide();
						console.log(res)
						if (res.code == 1) {
							uni.showToast({
								title: res.msg,
								icon: "none",
								duration: 1000
							})
							setTimeout(function(){
								uni.navigateBack()
							},2000)
						}
						if (res.code == 0) {
							uni.showToast({
								title: res.msg,
								icon: "none",
								duration: 2000
							})
						}
					}
				)
			},
			 
			 avatarImg() {
			 	var that = this
			 	//上传头像
				that.$common.uploadImage(
					 {},
					uploadFileRes => {
						that.$common.normalToShow('上传成功,请点击保存')
							//拿到头像图片路径
							that.avatar=uploadFileRes
							that.uploadTp=true;
							console.log(that.avatar);
						}
						)
			 },
		}
	}
</script>

<style>
	 view{box-sizing: border-box;}
	.flex_layout{display: flex; align-items: center; flex-wrap: wrap;}
	.addMessage_item{padding: 50upx 30upx; border-bottom: 1px solid #f2f2f2;}
	.addMessage_item:first-child{border-top: 1px solid #f2f2f2;}
	.left_name{color: #333; font-size: 30upx; width: 120upx;}
	.right_input{padding-left: 57upx; width: 570upx;}
	.right_input input{width: 500upx; padding-right: 30upx; box-sizing: border-box; color: #333; font-size: 30upx;}
	.right_input image{width: 13upx; height: 23upx; display: block;}
	.right_input .pickerDate{color: #999; font-size: 30upx;}
	.right_input .active{color: #333;}
	.otherCheck{color: #999; font-size: 30upx;}
	.otherCheck_color{color: #333;}
	.lableBox{justify-content: space-between;}
	.lableBox_img image{width: 13upx; height: 23upx;}
	.add_btn{padding: 30upx; margin-top: 30upx;}
	.add_btn button{height: 74upx; width: 100%; font-size: 36upx; color: #fff; margin: 0; padding: 0; line-height: 74upx; background: #2562a1; border-radius: 72px;}
    .addimg{padding: 30upx;}
	.addimg image{width: 140upx; height: 140upx; display: block; margin: 0 auto}
</style>
